<template>
    <div class="baseInfo">
        <el-form label-width="100px">

            <div class="flexDiv">
                <el-form-item label="" prop="num" label-width="0px" class="noLabelItem">
                    <div style="font-weight:700;font-size:16px;margin-right:8px;">切片ROI:(在切片浏览器做好标注会自动显示)</div>
                </el-form-item>

                <el-form-item label="" prop="sex" label-width="0px" class="noLabelItem">
                    <el-select v-model="baseInfo.sex" placeholder="选择标注区域" clearable class="idNumInput">
                        <el-option v-for="dict in sexArray" :key="dict.value" :label="dict.label" :value="dict.value" />
                    </el-select>
                </el-form-item>
            </div>
            <div class="imageListContainers" :class="device === 'mobile' ? 'active' : ''">
                <div class="imageListContainers-item">
                    <div class="imageListContainers-item-content">
                        <el-image :src="src" class="imageListContainers-item-image">
                            <div slot="placeholder" class="image-slot">
                                加载中<span class="dot">...</span>
                            </div>
                        </el-image>

                    </div>
                    <el-input type="textarea" :rows="2" placeholder="请输入内容" class="imageListContainers-item-content-input"
                        v-model="baseInfo.remark">
                    </el-input>

                </div>
                <div class="imageListContainers-item">
                    <div class="imageListContainers-item-content">
                        <el-image :src="src" class="imageListContainers-item-image">
                            <div slot="placeholder" class="image-slot">
                                加载中<span class="dot">...</span>
                            </div>
                        </el-image>
                    </div>
                    <el-input type="textarea" :rows="2" placeholder="请输入内容" class="imageListContainers-item-content-input"
                        v-model="baseInfo.remark">
                    </el-input>
                </div>
                <div class="imageListContainers-item">
                    <div class="imageListContainers-item-content">
                        <el-image :src="src" class="imageListContainers-item-image">
                            <div slot="placeholder" class="image-slot">
                                加载中<span class="dot">...</span>
                            </div>
                        </el-image>
                    </div>
                    <el-input type="textarea" :rows="2" placeholder="请输入内容" class="imageListContainers-item-content-input"
                        v-model="baseInfo.remark">
                    </el-input>
                </div>
                <div class="imageListContainers-item">
                    <div class="imageListContainers-item-content">
                        <el-image :src="src" class="imageListContainers-item-image">
                            <div slot="placeholder" class="image-slot">
                                加载中<span class="dot">...</span>
                            </div>
                        </el-image>
                    </div>
                    <el-input type="textarea" :rows="2" placeholder="请输入内容" class="imageListContainers-item-content-input"
                        v-model="baseInfo.remark">
                    </el-input>
                </div>
                <div class="imageListContainers-item">
                    <div class="imageListContainers-item-content">
                        <el-image :src="src" class="imageListContainers-item-image">
                            <div slot="placeholder" class="image-slot">
                                加载中<span class="dot">...</span>
                            </div>
                        </el-image>
                    </div>
                    <el-input type="textarea" :rows="2" placeholder="请输入内容" class="imageListContainers-item-content-input"
                        v-model="baseInfo.remark">
                    </el-input>
                </div>

            </div>
            <div class="flexDiv0">
                <el-form-item label="病例难度" prop="sex">
                    <el-select v-model="baseInfo.sex" placeholder="" clearable class="idNumInput0">
                        <el-option v-for="dict in sexArray" :key="dict.value" :label="dict.label" :value="dict.value" />
                    </el-select>
                </el-form-item>
                <el-form-item label="病理诊断" prop="sex">
                    <el-input type="textarea" :rows="3" placeholder="请输入内容" class="idNumtext0" v-model="baseInfo.remark">
                    </el-input>
                </el-form-item>
                <el-form-item label="肿瘤分类" prop="sex">
                    <el-select v-model="baseInfo.sex" placeholder="" clearable class="idNumInput0">
                        <el-option v-for="dict in sexArray" :key="dict.value" :label="dict.label" :value="dict.value" />
                    </el-select>
                </el-form-item>


            </div>
            <div class="flexDiv">
                <el-form-item label="肿瘤分期" prop="num">

                </el-form-item>
                <el-form-item label="T:" prop="num" label-width="30px" class="autoMobileLabel">
                    <el-select v-model="baseInfo.sex" placeholder="" clearable class="sexInput">
                        <el-option v-for="dict in sexArray" :key="dict.value" :label="dict.label" :value="dict.value" />
                    </el-select>
                </el-form-item>

                <el-form-item label="N:" prop="num" label-width="30px" class="autoMobileLabel">
                    <el-select v-model="baseInfo.sex" placeholder="" clearable class="sexInput">
                        <el-option v-for="dict in sexArray" :key="dict.value" :label="dict.label" :value="dict.value" />
                    </el-select>
                </el-form-item>
                <el-form-item label="M:" prop="num" label-width="30px" class="autoMobileLabel">
                    <el-select v-model="baseInfo.sex" placeholder="" clearable class="sexInput">
                        <el-option v-for="dict in sexArray" :key="dict.value" :label="dict.label" :value="dict.value" />
                    </el-select>
                </el-form-item>
            </div>


            <el-form-item label="诊断依据" prop="sex">
                <el-input type="textarea" :rows="3" placeholder="请输入内容" class="idNumtext0" v-model="baseInfo.remark">
                </el-input>

            </el-form-item>
            <el-form-item label="鉴别诊断" prop="sex">
                <el-input type="textarea" :rows="3" placeholder="请输入内容" class="idNumtext0" v-model="baseInfo.remark">
                </el-input>

            </el-form-item>
            <div class="flexDiv">
                <el-form-item label="点评者" prop="id">
                    <el-input v-model="baseInfo.id" placeholder="点评者" class="idNumInput0">
                    </el-input>
                </el-form-item>
                <el-form-item label="点评日期" prop="id">
                    <el-input v-model="baseInfo.id" placeholder="点评者" class="idNumInput0">
                    </el-input>
                </el-form-item>
            </div>
            <el-form-item>
                <el-button @click="closeEvent">关 闭</el-button>
                <el-button type="primary" @click="submitForm()">保 存</el-button>

            </el-form-item>
        </el-form>
    </div>
</template>
    
<script>



//自定义校验规则
var checkIdCard = (rule, value, cb) => {
    const regIdCard =
        /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
    if (regIdCard.test(value)) {
        return cb();
    }
    cb(new Error("您输入的身份证号码不是有效格式"));
};
var checkPatientPhone = (rule, value, cb) => {
    const regPatientPhone = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
    if (regPatientPhone.test(value)) {
        return cb();
    }
    cb(new Error("您输入的手机号码不是有效格式"));
};
export default {
    name: "Index",
    dicts: [

    ],
    components: {

    },
    data() {
        return {
            src: "https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg",
            // 顾客信息
            baseInfo: {
                num: undefined,
                id: undefined,
                name: undefined,
                teacher: undefined,
                student: undefined,
                release: 0,
                verify: 0,
                remark: undefined
            },


            sexArray: [
                {
                    value: '0',
                    label: '女'
                }, {
                    value: '1',
                    label: '男'
                }
            ],


        };
    },
    computed: {
        device() {
            return this.$store.state.device
        }
    },
    mounted() {

    },
    methods: {

        submitForm() {
            this.$emit('submitForm')
        },
        closeEvent() {
            this.$emit('close')
        },
    }
};
</script>
    
<style scoped lang="scss"></style>
    
    